<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // xhr 發送post請求有兩個特點：1.必須傳遞參數；2.必須設置頭信息確定參數的類型。

        // 1.創建
        const xhr = new XMLHttpRequest();

        // 2.設置
        xhr.open('post', 'http://www.liulongbin.top:3009/api/addbook');

        // 3.發送-請求體參數寫到send()參數中，而且需要設置頭信息確定參數類型；
        //     3.1 設置 application/x-www-form-urlencoded ，對應參數：a=1&b=2&c=3
        xhr.setRequestHeader('content-type','application/x-www-form-urlencoded');
        xhr.send('bookname=三重門&author=韓寒&publisher=上海人民出版社');

        //     3.2 設置 application/json ,對應參數：'{"a":'1',"b":'2'}'
        xhr.setRequestHeader('content-type','application/json');
        let obj = {bookname:'三重門',author:'韓寒',publisher:'上海人民出版社'};
        xhr.send(JSON.stringify(obj));

        //     3.3 設置 multipart/form-data:FormData類型數據，專門用於文件上傳(了解)；

        // 4.接收
        xhr.addEventListener('load',function(){
            console.log(JSON.parse(xhr.response));
        })
    </script>
</body>
</html>